<template>
    <div>
        <!-- 更新角色  -->
        <Modal v-model="showModal" title="白名单变更审核详情" :loading="loading" :mask-closable="false" :width="600" :closable="false">
            <Form ref="detailRole" :model="formItem" :label-width="90" :rules="ruleValidate">
                <FormItem label="商户名：" prop="roleName">
                    <Input v-model="formItem.roleName" placeholder="角色名称"  class="item-input-a"/>
                </FormItem>
                <FormItem label="代收款人：" prop="roleName">
                    <Input v-model="formItem.age" placeholder="角色名称"  class="item-input-a"/>
                </FormItem>
                <FormItem label="身份证号：" prop="roleName">
                    <Input v-model="formItem.adress" placeholder="角色名称"  class="item-input-a"/>
                </FormItem>
                <FormItem label="银行卡号：" prop="roleName">
                    <Input v-model="formItem.roleName" placeholder="角色名称"  class="item-input-a"/>
                </FormItem>
                <FormItem label="联系电话：" prop="roleName" class="d-color">
                    <Input v-model="formItem.roleName" placeholder="角色名称"  class="item-input-a"/>
                    &nbsp; &nbsp;&nbsp;&nbsp;原资料&nbsp;&nbsp;<Input v-model="formItem.roleName" placeholder="原资料"  class="item-input-a"/>
                </FormItem>

                <FormItem label="开卡省市：" prop="roleName">
                    <Select v-model="model1"  class="item-input-as">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                     省<Select v-model="model1"  class="item-input-as">
                    <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                </Select>
                </FormItem>
                <FormItem label="开卡银行：" prop="roleName" class="d-color">
                    <Select v-model="model1"  class="item-input-a">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                    &nbsp; &nbsp;&nbsp;&nbsp;原资料&nbsp;&nbsp;<Select v-model="model1"  class="item-input-a">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                </FormItem>
                <FormItem label="代扣有效期：" prop="roleName" class="d-color">
                    <Select v-model="model1"  class="item-input-a">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                    &nbsp; &nbsp;&nbsp;&nbsp;原资料&nbsp;&nbsp;<Select v-model="model1"  class="item-input-a">
                    <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                </Select>
                </FormItem>

                <FormItem label="身份证正面" prop="roleName">
                    <img class="item-input-a" src="http://119.29.4.110:9405/upload/20181127/anget/56/20181127160801663pxUDNMgN.jpg">
                </FormItem>

                <FormItem label="身份证反面" prop="roleName">
                    <img class="item-input-a" src="http://119.29.4.110:9405/upload/20181127/anget/56/201811271608099234rWg0isH.jpg">
                </FormItem>

                <FormItem label="代扣款授权书" prop="roleName">
                    <img class="item-input-a"src="http://119.29.4.110:9405/upload/20190513/shop/893/20190513094535653QGBsSBcR.jpg">
                </FormItem>


                <FormItem label="贷款合同" prop="roleName">
                    <img class="item-input-a"src="http://119.29.4.110:9405/upload/20190513/shop/893/20190513094535653QGBsSBcR.jpg">
                </FormItem>


                <FormItem label="银行卡正面" prop="roleName">
                    <img class="item-input-a"src="http://119.29.4.110:9405/upload/20190513/shop/893/20190513094535653QGBsSBcR.jpg">
                </FormItem>


                <FormItem label="变更申请书" prop="roleName">
                    <img class="item-input-a"src="http://119.29.4.110:9405/upload/20190513/shop/893/20190513094535653QGBsSBcR.jpg">
                </FormItem>



            </Form>
            <div slot="footer">
                <Button type="default" :disabled="loading" @click="cancel(false)">取消</Button>
                <Button type="primary" :loading="loading" @click="ok">确定</Button>
            </div>
        </Modal>
    </div>
</template>
<script>
    import { post } from '@/libs/axios-cfg'
    export default {
        data(){
            return {
                model1: '',
                cityList: [
                    {
                        value: '',
                        label: ''
                    }
                ],
                formItem: {
                    roleName:'',
                    adress: '',
                    age: '',
                },
                showModal:true,
                loading: false,
                ruleValidate:{
                    roleName:[
                        { required: true, message: '角色名称不能为空'}
                    ]
                }
            }
        },
        props:{
            detailObject:{
                type: Object,
                default: null
            },
            allResource:{
                type: Array
            }
        },
        created(){
            if(this.detailObject!=null){
                this.formItem = this.detailObject;
            }
        },
        methods:{
            cancel(up=false){
                this.$emit('cancel',up);
            },
            ok(){
                this.cancel(true);
                // this.$refs.detailRole.validate((valid) => {
                //     if (valid) {
                //
                //     }
                // })
            },


        }
    }
</script>
<style lang="less">
    .item-input-a {
        width: 200px;
    }
    .item-input-as {
        width: 92px;
    }
    .d-color {
        color: red;
    }
</style>

